<!-- 数据列表 -->
<% if (typeof data !== 'undefined') { %>
    <div class="table-responsive">
        <table class="table table-hover tbl_person">
            <tbody>
            <% for (let i = 0; i < data.rows.length; i++) { let p = EJS.person(data.rows[i]); %>
            <tr class="<%=i%2==0?'active':'warning'%>">
                <td><%=p.id%></td>
                <td><b><%=p.name%></b></td>
                <td><%=p.sex%></td>
                <td><%=p.age%>岁</td>
                <td><%=p.nongStr%></td>
                <td><%=p.gongStr%></td>
                <td>
                    <button class="btn btn-sm btn-info" onclick="mdf('<%=p.id%>')">修改</button>
                    <button class="btn btn-sm btn-warning" data-toggle="modal" data-target="#delModal"
                            onclick="$('#delID').val('<%=p.id%>');$('#delName').html('<%=p.name%>');">删除</button>
                </td>
            </tr>
            <% } %>
            </tbody>
        </table>
    </div>
    <ul class="pagination" id="person_list_page">
        <%
            var total = Math.ceil(data.count / rows);//总页数
            var width = 7;//显示数字个数
            var start = 1;
            var end = width;
            var left = "";//左边有省略
            var right = "";//右边有省略
            if (total > width) {
                if (page > Math.ceil(width / 2)) {//大于一半时往右移动
                    left = "...";
                    var move = page - Math.ceil(width / 2);
                    start += move;
                    end += move;
                    if (end > total) {//移动后超过了
                        var out = end - total;
                        end = total;
                        start -= out;
                    }
                }
                if (end < total)
                    right = "...";
            } else {
                end = total;
            }
        %>
        <li class="<%=page==1?'disabled':''%>"><a href="javascript:list('1');">&laquo;</a></li>
        <% for (let j = start; j <= end; j++) { %>
        <li class="<%=j==page?'active':''%>"><a href="javascript:list('<%=j%>');"><%=j==start?left+j:(j==end?j+right:j)%></a></li>
        <% } %>
        <li class="<%=page>=total?'disabled':''%>"><a href="javascript:list('<%=page>=total?total:page+1%>');">&raquo;</a></li>
    </ul>
<% } %>